<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		
	</body>
</html>
<!DOCTYPE html>
<!-- saved from url=(0037)http://127.0.0.1:8848/form/index.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		
		<title></title>
		<style>
		.b{
			display: flex;
			justify-content: center;
			font-size: 1.875rem;
			
		}
		.warp{
			display: flex;
			flex-direction: column;
			width: 31.25rem;
			height:50rem;
			display: flexbox;
		    box-shadow:1px 2px 3px 4px black;
			margin: auto;
			
		}
		.sp{
			display: flex;
			flex-direction: row;
		}
		.cz{
			display: flex;
			flex-direction: column;
			display: flex;
			justify-content: center;
			justify-content: space-around;
			width: 18.75rem;
			height: 7.8125rem;
		}
		.jj{
			display: flex;
			justify-content: center;
		}
		.jl{
			margin: 1.25rem;
		}
		#btn{
			
			margin: 0 1.25rem;
		}
		span{
			display: inline-block;
			padding-right: 10px;
			text-align: right;
			width: 100px;
		}
		</style>
	</head>
	<body>
		<p class="b">表单</p>
		<div class="warp">
			<!-- 普通文本 -->
		
			<div class="jl"> 
			<span>用户名：</span>
			<input type="text" placeholder="请输入用户名"><input type="button" id="sd" value="校验用户名是否合法"></div>
			<!-- 密码输入框 -->
				<div class="jl">
					<span>密码：</span>
					<input type="password" placeholder="请输入密码"></div>
				<!-- 纯数字 -->
				<div class="jl">
					<span>确认密码：</span>
					<input type="password" placeholder="请再次输入密码"></div>
			<div class="jl">	<!-- 单选框 -->
			<span>性别：</span>
				<input type="radio" value="male" name="sex">女<input type="radio" value="female" name="sex">男
				</div>
             <div class="jl">
				 <span>爱好：</span><!-- 多选框 -->
	            <input type="checkbox" value="run" name="hobby">跑步<input type="checkbox" value="basktball" name="hobby">篮球<input type="checkbox" value="run" name="swming">游泳
            </div>
				<!-- 下拉列表 -->
				<div class="sp jl">
					<span>专业：</span>
				<select name="subject">
					<option value="jsjyjs">计算机与技术</option>
					<option value="rjjs">软件技术</option>
				</select>
					
				</div>
				
				<!-- 大文本框 -->
				<div class="cz jl">
					<span>个人简介：</span>
					<textarea placeholder="简介" rows="20"></textarea>
				</div>
			<div class="jl">
				<span>头像：</span>
				<!-- 文件上传 --><input type="file" name="file">
			</div>
			<div class="jj jl">
				<div>
					<input type="button" value="提交" id="btn">
					<input type="button" value="重置" id="btn">
				</div>
			</div>
			<script>document.write('<script src="//' + (location.host || 'localhost').split(':')[0] + ':35929/livereload.js?snipver=1"></' + 'script>')</script><script src="./index_files/livereload.js.下载"></script><script>document.addEventListener('LiveReloadDisconnect', function() { setTimeout(function() { window.location.reload(); }, 500); })</script>
		

</div></body></html>